<template>
	<view class="content">
		 
		<nuoyu-search ref="onSearch" :modelValue="content" @confirm="confirm" @search="search" :btnTextColor="themeColor.main_color" 
		:search-btn-style="{
		  background:themeColor.main_color,
		  borderRadius: '100rpx'
		}">
		</nuoyu-search>
		
		 <view style="margin-left: 24rpx;display: flex;align-items: center;gap: 12rpx;">
			<image style="height: 64rpx;width: 64rpx;border-radius: 8rpx;" :src="userInfo.head_img" mode="aspectFill"></image>
			<view style="display: flex;justify-content: space-between;align-items: center;width: 80%;">
				<view style="font-weight: 600;">{{userInfo.nickName}}</view>
				<view style="font-size: 26rpx;" :style="'color:'+themeColor.main_color">(使用点数:{{money.toFixed(2)}})</view>
			</view>
			
		 </view>
		 <view class="AIStyle" >
		 	<nuoyu-printer :ref="'printer'" :fontColor="'#333'" :cursorColor="themeColor.main_color" :fontSize="18"></nuoyu-printer>
		 </view>
		 <!-- <view class="AIStyle" >
		 	<nuoyu-printer :ref="'printer1'" :fontColor="'#333'" :cursorColor="themeColor.main_color" :fontSize="18"></nuoyu-printer>
		 </view>
		 <view style="margin-left: 24rpx;display: flex;align-items: center;gap: 12rpx;" v-if="DeskList.length > 1">
		 			<image style="height: 64rpx;width: 64rpx;border-radius: 8rpx;" :src="DeskList[0].head_img" mode="aspectFill"></image>
		 <span>{{DeskList[0].nickName}}</span>
		 </view>
		
		 <view  class="AIStyle" >
		 	<nuoyu-printer :ref="'printer2'" :fontColor="'#333'" :cursorColor="themeColor.main_color" :fontSize="18"></nuoyu-printer>
		 </view>
		 <view style="margin-left: 24rpx;display: flex;align-items: center;gap: 12rpx;" v-if="DeskList.length > 2">
		 			<image style="height: 64rpx;width: 64rpx;border-radius: 8rpx;" :src="DeskList[0].head_img" mode="aspectFill"></image>
		 <span>{{DeskList[0].nickName}}</span>
		 </view>
		 <view class="AIStyle" >
		 	<nuoyu-printer :ref="'printer3'" :fontColor="'#333'" :cursorColor="themeColor.main_color" :fontSize="18"></nuoyu-printer>
		 </view>
		 <view style="margin-left: 24rpx;display: flex;align-items: center;gap: 12rpx;" v-if="DeskList.length > 3">
		 			<image style="height: 64rpx;width: 64rpx;border-radius: 8rpx;" :src="DeskList[0].head_img" mode="aspectFill"></image>
		 <span>{{DeskList[0].nickName}}</span>
		 </view>
		 
		 <view class="AIStyle" >
		 	<nuoyu-printer :ref="'printer4'" :fontColor="'#333'" :cursorColor="themeColor.main_color" :fontSize="18"></nuoyu-printer>
		 </view>
		 <view style="margin-left: 24rpx;display: flex;align-items: center;gap: 12rpx;" v-if="DeskList.length > 4">
		 			<image style="height: 64rpx;width: 64rpx;border-radius: 8rpx;" :src="DeskList[0].head_img" mode="aspectFill"></image>
		 <span>{{DeskList[0].nickName}}</span>
		 </view>
		 <view class="AIStyle" >
		 	<nuoyu-printer :ref="'printer5'" :fontColor="'#333'" :cursorColor="themeColor.main_color" :fontSize="18"></nuoyu-printer>
		 </view> -->
		 
		<!-- <view>
			<view v-for="(item,index) in DeskList">
				<text v-html="item"></text>
			</view>
		</view> -->
	</view>
</template>

<script>
import store from "@/store/index.js"
export default {
	  data() {
		return {
			content:'',
			DeskList:[],
			themeColor:'',
			wechatConfig:'',
			userInfo:'',
			money:0
		}
	  },
	onLoad() {
		this.themeColor = this.$store.state.themeConfig || uni.getStorageSync('themeConfig')
		this.wechatConfig = this.$store.state.wechatConfig ||  uni.getStorageSync('wechatConfig')
		// this.getAnswersSparkDesk();
		this.getAnswersSparkDeskAi();
		this.userInfo = uni.getStorageSync('userInfo')
	},
	methods: {
		getAnswersSparkDeskAi(){
			this.tui.request("/basic-capi/SparkDesk/getRechargerecordAi", "get",{
			}).then((res) => {
				if(res.code == 200){
					this.money = res.data.list
				}
			}).catch((res) => {
				 
			})
		},
		getAnswersSparkDesk(){
			setTimeout(()=>{
				this.tui.request("/basic-capi/SparkDesk/getAnswersSparkDesk", "get",{
				}).then((res) => {
					if(res.code == 200){
						this.DeskList = res.data.list
						for (var i = 0; i < this.DeskList.length; i++) {
							if(this.DeskList[i].content){
								JSON.parse(this.DeskList[i].content).forEach((item,index)=>{
									this.$refs[`printer${i+1}`].input(`${item.content}`)
								})
							}
							// JSON.parse(this.DeskList[i].content).forEach((item,index)=>{
							// 	this.$refs.printer.input(`\\n`)
							// })
						}
						
					}
				}).catch((res) => {
					 
				})
			},100)
			
		},
		search(e){
			
			this.$refs.printer.input()
			
			this.tui.request("/basic-capi/SparkDesk/answers", "post",{
				content:e,
				type:'1',
				nickName:uni.getStorageSync('userInfo').nickName,
				head_img:uni.getStorageSync('userInfo').head_img,
				phone:uni.getStorageSync('userInfo').phone,
			}).then((res) => {
				if(res.code == 200){
					// this.getAnswersSparkDesk();
					this.DeskList = res.data.list
					for (var i = 0; i < this.DeskList.length; i++) {
						this.$refs.printer.input(`${this.DeskList[i].content}`)
					}
					
					this.getAnswersSparkDeskAi();
				}
			}).catch((res) => {
				 
			})
		},
		confirm(e){
			this.tui.request("/basic-capi/SparkDesk/answers", "post",{
				content:e,
				type:'1',
				nickName:uni.getStorageSync('userInfo').nickName,
				head_img:uni.getStorageSync('userInfo').head_img,
				phone:uni.getStorageSync('userInfo').phone,
			}).then((res) => {
				if(res.code == 200){
					// this.getAnswersSparkDesk();
					this.DeskList = res.data.list
					for (var i = 0; i < this.DeskList.length; i++) {
						this.$refs.printer.input(`${this.DeskList[i].content}`)
					}
					this.getAnswersSparkDeskAi();
					
				}
			}).catch((res) => {
				 
			})
		}
	}
}
</script>

<style>
	.AIStyle{
		margin: 8px 24rpx;
		color: $u-content-color;
		line-height: 1.6;
		background: #eee;
		border-radius: 6rpx;
		padding: 6rpx 8rpx;
	}
</style>
